<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>用户缴费记录</title>
</head>
<link rel="stylesheet" href="https://cdn.bootcss.com/weui/1.1.3/style/weui.min.css">
<link rel="stylesheet" href="https://cdn.bootcss.com/jquery-weui/1.2.1/css/jquery-weui.min.css">

<link rel="stylesheet" href="../../src/dist/css/page.css">

<body>
<div class="weui-cells user-recordList">
    <div class="weui-cells__tips">用户缴费记录</div>
    <div class="weui-cells" id="listDemo">
        <img src="../../src/dist/img/nodata.png" alt="" class="nodataImg">
    </div>
</div>

<script src="https://cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/jquery-weui/1.2.1/js/jquery-weui.min.js"></script>

<!-- Dist -->
<script src="../../src/dist/js/index.js"></script>
<script src="../../src/dist/js/utils.js"></script>
<script src="../../src/dist/js/request.js"></script>
<script>
    var recordData = [],
		customid = '',
      openid = '';
    $(function(){
        var paras = location.search;            //search获得地址中的参数，内容为'?itemId=12'
        var result = paras.match(/[^\?&]*=[^&]*/g);     //match是字符串中符合的字段一个一个取出来，result中的值为['login=xx','table=admin']
        paras = {};                    //让paras变成没有内容的json对象
        for (i in result) {
            var temp = result[i].split('=');    //split()将一个字符串分解成一个数组,两次遍历result中的值分别为['itemId','xx']
            paras[temp[0]] = temp[1];
        }
		customid = paras.customid;     //根据参数名"itemId"，获取参数值

        //getRecodeList()   //真实接口数据
		getRecodeListPHP() // 本地测试数据
    })

    function getRecodeListPHP() {
        $.ajax({
            type: "POST",
            url: "../../src/php/requestOnline.php",
            data: {
                act: 'CSRQ_getRecodeList'
            },
            success: function (data) {
                data = eval('(' + data + ')')
				recordData = data.list
                createListDemo()
            },
            error: function (data) {

            }
        });
	}
    function getRecodeList() {
			//customid = '1020017398'
        get("/fees/gasfee/page?page=1&limit=150&paytype=&operatetype=201&queryfeild=" + customid, {}, function (data) {
            if (data.code === 0) {
				recordData = data.data.list
                if(data.data.list.length ===0 ){
					$.toast('暂无数据!', 'text');
                	return
                }
                createListDemo()
            } else {
                $.toast('获取缴费记录失败!', 'forbidden');
            }
        }, false, true);
	}
	function createListDemo(){
			let d = recordData
			let h = ''
			for (let [index, item] of d.entries()) {
				h += '<div class="list-card">\n' +
            '            <div class="card-h">\n' +
            '                <i class="iconfont iconyonghuming"></i>\n' +
            '                <span class="card-key">缴费人：</span>\n' +
            '                <span class="card-value">'+item['customname']+'</span>\n' +
            '            </div>\n' +
            '            <div class="card-h">\n' +
            '                <i class="iconfont iconicon-jinriyongqiliang"></i>\n' +
            '                <span class="card-key"> 购气量：</span>\n' +
            '                <span class="card-value">'+item['volume']+'</span>\n' +
            '            </div>\n' +
            '            <div class="card-h">\n' +
            '                <i class="iconfont iconjine"></i>\n' +
            '                <span class="card-key"> 缴费金额：</span>\n' +
            '               <span class="card-value">'+(item['amount'] === null?0:item['amount'])+'</span>\n' +
            '            </div>\n' +
            '            <div class="card-h">\n' +
            '                <i class="iconfont icongongsi"></i>\n' +
            '                <span class="card-key"> 公司名称：</span>\n' +
            '                <span class="card-value">'+ item['branchname']+'</span>\n' +
            '            </div>\n' +
            '            <div class="card-h">\n' +
            '                <i class="iconfont iconshijian"></i>\n' +
            '                <span class="card-key"> 缴费时间：</span>\n' +
            '                <span class="card-value">'+ item['feedate']+'</span>\n' +
            '            </div>\n' +
            '        </div>'
			}
			$("#listDemo").html(h)
    }

</script>
</body>
</html>
